<template>
  <el-select
    v-model="selectedValue"
    :size="size"
    :placeholder="column.placeholder"
    @change="handleChange"
  >
    <el-option
      v-for="option in column.options"
      :key="option.value"
      :label="option.label"
      :value="option.value"
    />
  </el-select>
</template>

<script setup>
import { computed } from 'vue'

const props = defineProps({
  row: Object,
  column: Object,
  index: Number,
  size: 'small'
})

const emit = defineEmits(['update'])

const selectedValue = computed({
  get: () => props.row[props.column.prop],
  set: (value) => {
    emit('update', value)
  }
})

const handleChange = (value) => {
  emit('update', value)
}
</script>